<template>
  <div>
    <TopFilter :list="topFilterList"
               :cols="3"
               @filterChange="changeHandle"
               @onCollapse="collapseHandle"
               :labelWidth="110"></TopFilter>
    <FilterTable ref="table"
                 :columns="columns"
                 :fetchapi="fetchApi"
                 :params="fetchParams"
                 :datakey="'records'"
                 :isSelectColumn="false"
                 columnsRef="zjdownload"
                 :onRowSelectChange="selectChangeHandle"
                 :onColumnsChange="columns => (this.columns = columns)">
      <!-- <template slot="controls" slot-scope="props">
        <multiuse-button size="small" type="primary" @click="addHandle()">导 出</multiuse-button>
      </template> -->
    </FilterTable>
  </div>
</template>
<script>
import axios from '@/api/fetch';
// const OSS = require('ali-oss');
//配置不可以修改 ，客户的oss
// const client = new OSS({
//   region: 'oss-cn-beijing',
//   accessKeyId: '1111',
//   accessKeySecret: '1111',
//   bucket: 'bjev-cms-oss-public'
// });
import { dictionary } from '@/utils/dictMixin';
import { getList, updateDownlod, findFileByUrl } from '@/api/common/auth/downloadCenter/index.js';
import { downloadUrl } from '@/utils';
export default {
  data() {
    this.resumeClient = {};
    this.client = {};
    this.keyRes = undefined;
    return {
      topFilterList: this.createdFrom(),
      columns: this.createdTable(),
      fetchApi: getList,
      fetchParams: {}
    };
  },
  mixins: [dictionary],
  created() {
    // try {
    //   this.getFileKey().then(res => {
    //     console.log(this.keyRes, 'keyRes');
    //     console.log(this.keyRes, 'keyRes');
    //     const accessKeyId = this.keyRes ? this.keyRes.accessKeyId : '111';
    //     const accessKeySecret = this.keyRes ? this.keyRes.accessKeySecret : '111';
    //     this.client = new OSS({
    //       region: 'oss-cn-beijing',
    //       accessKeyId: accessKeyId,
    //       accessKeySecret: accessKeySecret,
    //       bucket: 'bjev-cms-oss-public'
    //     });
    //     this.resumeClient = new OSS({
    //       region: 'oss-cn-beijing',
    //       accessKeyId: accessKeyId,
    //       accessKeySecret: accessKeySecret,
    //       bucket: 'bjev-cms-oss-public'
    //     });
    //   });
    // } catch (error) {
    //   console.log('获取文件服务报错', error);
    // }
  },
  mounted() {
    this.BaseTable = this.$refs.table.$refs.pageTable;
  },
  methods: {
    async a(url, fileName, fileId) {
      // open(url);
      if (!url) {
        return;
      }
      let resUrl = await findFileByUrl(url);
      let res = await updateDownlod(fileId);
      const converUrl = resUrl.data;

      if (res.resultCode == 200 && converUrl) {
        console.log('修改成功');
        downloadUrl(converUrl, fileName);
      }
      this.fetchParams = { ...this.fetchParams };
      // downloadUrl(converUrl, fileName);
    },
    createdFrom() {
      return [
        {
          type: 'INPUT',
          label: '文件名称',
          fieldName: 'fileName',
          placeholder: '请输入'
        },

        {
          type: 'RANGE_DATE',
          label: '创建日期',
          fieldName: 'startDate|endDate',
          placeholder: '请选择',
          initialValue: []
        }
      ];
    },
    createdTable() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          fixed: 'left',
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '文件名称',
          dataIndex: 'fileName',
          sorter: true,
          filter: true,
          filterType: 'input',
          render: p => {
            return p.row.status == 61001002 ? (
              <div>
                <span style="color:#bb0a30;cursor:pointer;" onClick={() => this.a(p.row.fileAddress, p.row.fileName, p.row.fileId)}>
                  {p.row.fileName}
                </span>
              </div>
            ) : (
              <span>{p.row.fileName}</span>
            );
          }
        },
        // <a style="color:#bb0a30;cursor:pointer;"  href={p.row.url} target="_blank" download>
        //       {p.row.fileName}
        //     </a>
        {
          title: '是否成功',
          dataIndex: 'errorText',
          sorter: true,
          filter: true,
          filterType: 'input',
          render: p => {
            let test = p.row.errorText == 'success' ? '成功' : p.row.errorText;
            return <span>{test}</span>;
          }
        },
        {
          title: '下载状态',
          dataIndex: 'status',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [
            { text: '下载中', value: 61001001 },
            { text: '下载完成', value: 61001002 },
            { text: '下载失败', value: 61001003 }
          ],
          render: p => {
            return <span>{this.formatStatus(p.row.status)}</span>;
          }
        },
        {
          title: '导出数量',
          dataIndex: 'total',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '是否下载',
          dataIndex: 'isDownlod',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [
            { text: '是', value: 10041001 },
            { text: '否', value: 10041002 }
          ],
          render: p => {
            return <span>{p.row.isDownlod == 10041001 ? '是' : '否'}</span>;
          }
        },
        {
          title: '创建人员',
          dataIndex: 'createName',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '创建时间',
          dataIndex: 'createDate',
          sorter: true,
          filter: true,
          filterType: 'input'
        }
      ];
    },
    changeHandle(params) {
      this.fetchParams = Object.assign({}, this.fetchParams, params);
    },
    collapseHandle() {
      this.$nextTick(() => {
        this.BaseTable.EXECUTE_RESET_HEIGHT();
      });
    },
    // async getFileKey() {
    //   console.log('执行:::');
    //   let res = await axios.post(`/api/file/oss/getFileKey`);
    //   console.log(res, 'res:::');
    //   this.keyRes = res;
    //   return '';
    // },
    async changeUrl(url, filename) {
      if (!url) {
        return;
      }
      let res = await findFileByUrl(url);
      return res.data;
      // let index = url.lastIndexOf('.');
      // let pix = url.substr(index + 1);
      // let fileNames = `${filename}.${pix}`;
      // if (url.split('https://bjev-cms-oss-public.oss-cn-beijing.aliyuncs.com/').length > 1) {
      //   let key = url.split('https://bjev-cms-oss-public.oss-cn-beijing.aliyuncs.com/')[1];
      //   const response = {
      //     'content-disposition': `attachment; filename=${encodeURIComponent(fileNames)}`
      //   };
      //   console.log(fileNames, 'fileNames');
      //   // 填写Object完整路径。Object完整路径中不能包含Bucket名称。
      //   // console.log(this.client, 'client');
      //   // const urls = this.client.signatureUrl(key, { response });
      //   // console.log(urls, 'urls');
      //   // return urls;
      // } else {
      //   return url;
      // }
    },
    formatStatus(item) {
      if (item == 61001001) {
        return '下载中';
      } else if (item == 61001002) {
        return '下载完成';
      } else {
        return '下载失败';
      }
    },
    selectChangeHandle(val) { }
  }
};
</script>
